<!DOCTYPE html>
<html lang="en">

<head>
    <#include "/lx/admin/components/meta.html" />
    <title>中介公司详情 ${metaTitleSuffix!}</title>
    <#include "/lx/admin/components/stylesheets.html" />
</head>

<body>
    <div id="app">
        <el-container>
            <#assign menuIndex="7-1" />
            <#include "/lx/admin/components/menu.html" />
            <el-container>
                <#include "/lx/admin/components/header.html" />
                <el-main>
                    <template>
                        <el-form ref="form" :model="info" label-width="100px">
                            <el-form-item label="公司名称">
                                <el-input v-model="info.name" placeholder="请输入公司名称"></el-input>
                            </el-form-item>
                            <el-form-item label="英文名">
                                <el-input v-model="info.englishName" placeholder="请输入英文名"></el-input>
                            </el-form-item>
                            <!-- <el-form-item label="LOGO">
                                <el-upload class="avatar-uploader" :on-success="handleLogoSuccess" :http-request='uploadQnFile' list-type='picture' :show-file-list="false">
                                    <img v-if="info.logo" :src="info.logo" class="avatar">
                                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                                </el-upload>
                            </el-form-item> -->
                            <el-form-item label="状态">
                                <el-radio-group v-model="info.status">
                                    <el-radio :label="1">正常</el-radio>
                                    <el-radio :label="0">禁用</el-radio>
                                </el-radio-group>
                            </el-form-item>
                            <el-form-item label="一级代理">
                                <el-select v-model="info.companyId" filterable placeholder="请选择" clearable>
                                    <el-option v-for="item in companies" :key="item.id" :label="item.name" :value="item.id">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="签约大学">
                                <el-checkbox-group v-model="checkList">
                                    <el-checkbox :label='school.id' v-for='school in schools'>{{school.name}}</el-checkbox>
                                </el-checkbox-group>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="submit">提交</el-button>
                            </el-form-item>
                        </el-form>
                    </template>
                </el-main>
            </el-container>
        </el-container>
        <#include "/lx/admin/components/footer.html" />
    </div>
    <#include "/lx/admin/components/scripts.html" />
    <#include "/lx/admin/components/qiniu.html" />
    <!-- <script src="/components/utils.js"></script> -->
    <script type="text/javascript">
    var vue = new Vue({
        el: '#app',
        data() {
            return {
                info: {},
                schools: toJson(`${schools}`),
                signSchools: toJson(`${signSchools}`),
                companies: toJson(`${companies}`),
                checkList: []
            }
        },
        watch: {

        },
        mounted: function() {
            this.info = toJson(`${info}`)
            var signSchools = this.signSchools
            for (var idx in signSchools) {
                var info = signSchools[idx]
                this.checkList.push(info.id)
            }
        },
        methods: {
            submit() {
                var self = this;
                if (!self.info.name) {
                    msg("请输入公司名称");
                    return;
                }
                if (!self.info.englishName) {
                    msg("请输入英文名");
                    return;
                }

                var signSchoolIds = ''
                var checkList = this.checkList
                for (var idx in checkList) {
                    var id = checkList[idx]
                    signSchoolIds = signSchoolIds + id + ';'
                }

                var url = "/lx/admin/company/submit"
                var param = {
                    id: self.info.id,
                    name: self.info.name,
                    englishName: self.info.englishName,
                    status: self.info.status,
                    companyId: self.info.companyId,
                    signSchoolIds: signSchoolIds
                };
                var success = (response) => {
                    if ('${referer!}' != '') {
                        window.location.href = '${referer!}';
                    } else {
                        window.location.href = "/lx/admin/company/list";
                    }
                }
                var fail = (response) => {
                    msg(response.msg);
                }
                var complete = () => {}
                axiosRequestPro(url, param, success, fail, complete);
            },
            handleLogoSuccess(res, file) {
                console.log(res)
                this.info.logo = res.data.url;
            }
        }
    })
    </script>
    <style type="text/css">
    .title {
        font-size: 18px;
        font-weight: bold;
    }

    input[type="file"] {
        display: none !important;
    }

    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }

    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }

    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }

    .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }

    .block-title {
        margin-bottom: 10px;
    }
    </style>
    <#include "/lx/admin/components/msg.html" />
</body>

</html>